@charset "UTF-8"

body
ul
	padding 0
	margin 0

a:link
	color $blue
	text-decoration none

.btn
	text-wrap nowrap

.panel
	position fixed
	top 2vh
	z-index 8
	display flex
	justify-content space-between
	flex-direction column
	height 25vh

#sidebar
	width 50vw
	left auto
	right 0

	dt:after
		content ":"

.l-label
	display block
	padding 0.5rem
	cursor pointer

// Table
.table-select
	th:first-child
	td:first-child
		padding 0

	input[type=checkbox]
		margin 0

.table-tip
	td:nth-child(2)
		padding 0

tile-info
	position fixed
	top 25vh
	left 0
	width 25vw
	height 70vh
	overflow auto
	padding 1rem

	h2
		margin 0

	dl
		display grid
		grid-template-columns auto auto
		margin-left 1rem

#map-settings
	label
		display block
		padding 0.5rem
		cursor pointer

c-pagination
	justify-content center

#info
	position absolute
	top 0
	left 6em
	font-family monospace
	font-size large

.swap
	min-height 1.75rem
	height 1.75rem

.p-btn
	display flex
	flex-direction column
	justify-content center
	height 2rem
	padding-left 0.3rem

building-table
	th:first-child
		padding 4px

	td
		text-wrap nowrap

	.building-icon
		padding-left 0
		padding-right 0
		background url(../tex.avif) content-box content-box
		width 32px
		height 32px

// tab-container

[role=tablist]
	@apply flex justify-evenly
	width 100%
	h2
		font-size 1.3rem

[role=tab]
	padding 0 0.25rem
	cursor pointer

[role=tab][aria-selected=true]
	border-bottom 0.15em solid
	border-image linear-gradient(2rad, rgb(0, 192, 64) 0%, rgb(192, 192, 32) 50%, rgb(45, 81, 237) 100%) 1 1

[c-show]
	display none !important

// Icon

.icon-random
	&:before
		content "🎲"
		display inline-block
		font-size 1.2rem
		transition transform 0.1s linear
	&:hover
		&:before
			transform rotate(2rad)
